<template>
  <router-view></router-view>
</template>

<script setup>
import { onMounted, watch } from 'vue';
import { useRoute } from 'vue-router';

// 应用主题的函数
const applyTheme = () => {
  const userId = localStorage.getItem('userId');
  if (userId === '1') {
    document.body.classList.remove('theme-female');
    document.body.classList.add('theme-male');
  } else if (userId === '2') {
    document.body.classList.remove('theme-male');
    document.body.classList.add('theme-female');
  } else {
    // 默认或未选择主题
    document.body.classList.remove('theme-male', 'theme-female');
  }
};

// 组件挂载时应用主题
onMounted(() => {
  applyTheme();
});

// 监听路由变化以重新应用主题（以防localStorage变化）
const route = useRoute();
watch(() => route.path, () => {
  applyTheme();
});
</script>